import {designPage, reactive} from "plain-design-composition";
import {PlButton, PlDate, PlForm, PlFormItem, PlInput, PlNumber} from "plain-design";

export default designPage((props) => {

    console.log(props)

    const state = reactive({
        formData: props.page.param
    })

    return () => (
        <div style={{padding: '20px', backgroundColor: 'white'}}>
            <PlForm>
                <PlFormItem label="文本normalText">
                    <PlInput v-model={state.formData.normalText}/>
                </PlFormItem>
                <PlFormItem label="日期">
                    <PlDate v-model={state.formData.dateVal}/>
                </PlFormItem>
                <PlFormItem label="计数count">
                    <PlNumber v-model={state.formData.count}/>
                </PlFormItem>
                <PlFormItem label="长文本longText">
                    <PlInput textarea v-model={state.formData.longText}/>
                </PlFormItem>
                <PlFormItem>
                    <PlButton onClick={() => props.nav.back()}>返回</PlButton>
                </PlFormItem>
            </PlForm>
        </div>
    )
})